<template>
  <div>
    <van-nav-bar title="文章详情" left-arrow @click-left="onClickLeft" />


    <div>
      <h3>{{aaa.title}}</h3>
      <p>{{aaa.author}}</p>
      <img :src="aaa.avatar" >
    </div>








    <div class="article-bottom">
      <van-button
        class="comment-btn"
        type="default"
        round
        size="small"
      >写评论</van-button>
      <van-icon
        name="comment-o"
        color="#777"
      />
      <van-icon
        name="star"
		 color="#777"
      />
      <van-icon
        color="#777"
        name="good-job"
      />
      <van-icon name="share" color="#777777"></van-icon>
    </div>
  </div>
</template>

<script>
export default {
  data(){
    return{
      aaa:""
    }
  },
  mounted(){
    console.log(this.$route.query)
    this.getData()
  },
  methods: {

        onClickLeft() {
            this.$router.back();
        },
        getData() {
          let {id , user_id} = this.$route.query
          this.$http
          .post("/api/get_article_detail",{
            article_id:id,
            user_id:user_id
          }).then((res)=>{
            console.log(res);
            this.aaa=res.data.data
        })
  },
  }
}
</script>

<style>
.article-bottom {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: space-around;
  align-items: center;
  box-sizing: border-box;
  height: 44px;
  border-top: 1px solid #d8d8d8;
  background-color: #fff;
}
.comment-btn {
    width: 141px;
    height: 23px;
    border: 1px solid #eeeeee;
    font-size: 15px;
    line-height: 23px;
    color: #a7a7a7;
  }

</style>